import React, {Component} from 'react';
import './App.css';

class App extends Component {
    Simple = () => {
        let request = new XMLHttpRequest();
        request.open('get', 'http://localhost:3000/cors/simple?time=' + Date.now());
        request.send();

        request.onreadystatechange = () => {
            if (request.readyState === 4) {
                console.log(request.responseText);
            }
        }
    };

    NotSimple = () => {
        const request = new XMLHttpRequest();
        let data = {
            name: 'Chengcheng.Zhou',
            age: 26
        };
        request.open('POST', 'http://localhost:3000/cors/complex?time=' + Date.now(), true);
        request.setRequestHeader('Content-Type', 'application/json;charset=utf-8');
        request.onreadystatechange = () => {
            if (request.readyState === 4) {
                console.log(request.responseText);
            }
        };
        request.send(JSON.stringify(data));
    };

    render() {
        return (
            <div className="App">
                <header className="App-header">
                    <h1 className="App-title">Welcome to React</h1>
                </header>
                <p className="App-intro">
                    <input type="button" value="Simple" onClick={this.Simple}/>
                    <input type="button" value="Not-Simple" onClick={this.NotSimple}/>
                </p>
            </div>
        );
    }
}

export default App;